<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<style type="text/css">
body{
	margin:5px;
	padding:0px;
	font-size:16px;
	overflow:hidden;
	}
.style1{
	width:200px;
	background-color:#3994EE;
	padding:5px;
	}
.style2{
	width:190px;
	background-color: #FFF;
	height:680px;
	padding:5px;
	}
.style3{
	margin-bottom:5px;
	width:188px;
	border:#3994EE solid 1px;
	text-align:center

	}
.style4{
	width:188px;
	height:30px;
	background-color:#3994EE;
	color:#FFF;
	font-size:24px;
	}
.style5{
	display:none;
	}
.style5 div{
	font-family: "幼圆";
	margin-top:0px;
	border-bottom:#3994EE solid 1px;
	border-left:0px;
	border-right:0px;
	height:30px;
	background-color:#F0F3FF;
	color: #5A5A5A;
	line-height:2;

	}
.style5 div:hover{
	line-height:1;
	font-size:24px;
	background-color: #F0FFF8;
	color:#F60;
	cursor:pointer;
	}
.style4:hover{
	background-color:#0CF;
	cursor:pointer;
	}		
</style>
<script type="text/javascript">
	function divdisplay(divdisplay){
		var div =document.getElementById(divdisplay);
	div.style.display=div.style.display=="block"?"none":"block";
		}
</script>
<body>
<div>
	<div class="style1">
		<div class="style2">
        <!--部门管理-->  
        <div class="style3">
                  <div class="style4" onclick=									                      "divdisplay('style5')">
                       <strong>部门管理</strong>
                  </div>
                  <div id="style5" class="style5">
                     <div>新建部门</div>
                     <div>修改部门</div>
                     <div>删除部门</div>
                     <div>查询部门下员工</div>
                 </div>
             </div>
         <!--员工管理-->  
             <div class="style3">
                  <div class="style4" onclick=									                      "divdisplay('style6')">
                       <strong>岗位管理</strong>
                  </div>
                  <div id="style6" class="style5">
                     <div>新建岗位</div>
                     <div>修改岗位</div>
                     <div>删除岗位</div>
                     <div>查询岗位下员工</div>
                 </div>
             </div>
          <!--员工管理-->  
             <div class="style3">
                  <div class="style4" onclick=									                      "divdisplay('style7')">
                       <strong>员工管理</strong>
                  </div>
                  <div id="style7" class="style5">
                     <div>员工入职管理</div>
                     <div>员工信息中心</div>
                     <div>员工异动管理</div>
                     <div>员工离职管理</div> 
                 </div>
             </div>
          
           <!--报表管理-->
         		  <div class="style3">
                      <div class="style4" onclick=									                      "divdisplay('style9')">
                           <strong>报表管理</strong>
                      </div>
                      <div id="style9" class="style5">
                         <div>新聘员工报表</div>
                         <div>离职员工报表</div>
                         <div>部门调动报表</div>
                         <div>岗位调动报表</div>
                         <div>人事月报报表</div>
                     </div>
                 </div>
        </div>
    </div>
</div>
</body>
</html>
